import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs'
import ElevationDownloader from '@/components/ElevationDownloader'
import ElevationGridSlicer from '@/components/ElevationGridSlicer'
import { ThemeProvider } from '@/components/theme-provider'
import { ConfigProvider } from '@/context/config-context'
import { Toaster } from 'sonner'

function App(): React.JSX.Element {
  return (
    <ThemeProvider defaultTheme="light" storageKey="vite-ui-theme">
      <ConfigProvider>
        <div className="flex flex-col items-center p-2 md:p-4 min-h-svh max-w-full">
          <h1 className="text-2xl font-bold mb-4 md:mb-6">高程数据处理工具</h1>
          <div className="w-full max-w-5xl mx-auto px-2">
            <Tabs defaultValue="download" className="w-full">
              <TabsList className="w-full h-12  md:w-3/4 mx-auto mb-2 grid  grid-cols-2">
                <TabsTrigger value="download" className=" text-base">
                  高程数据下载
                </TabsTrigger>
                <TabsTrigger value="slicer" className=" text-base">
                  高程数据网格切片
                </TabsTrigger>
              </TabsList>

              <div className="mt-2 px-2">
                <TabsContent value="download" className="mt-0">
                  <ElevationDownloader />
                </TabsContent>

                <TabsContent value="slicer" className="mt-0">
                  <ElevationGridSlicer />
                </TabsContent>
              </div>
            </Tabs>
          </div>
        </div>
        <Toaster />
      </ConfigProvider>
    </ThemeProvider>
  )
}

export default App
